import Base from "../Base.js";
import adminsApi from "../../api/admins.js";
import schedulesApi from "../../api/schedules.js";

export default class extends Base {
    constructor(props) {
        super(props);
    }
    handle() {
        layui.table.on('tool(schedules)', async (obj) => {
            //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
            // var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
            // var tr = obj.tr; //获得当前行 tr 的 DOM 对象（如果有的话）
            const _id = obj.data._id;
            if (layEvent === 'updata') {
                sessionStorage.setItem("schedule", JSON.stringify(obj.data));
                location.hash = `#/info/updataSchedule/${_id}`;
            } else if (layEvent === 'delete') {
                layer.confirm('真的删除行么', async (index) => {
                    obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
                    layer.close(index);
                    //向服务端发送删除指令
                    const data = await schedulesApi.delete(_id);
                    console.log(data);
                    this.reRender();
                });
            } else if (layEvent == "selectSeats") {
                location.hash = `#/info/selectSeats/${_id}`;
            }
        })
    }
    render() {
        this.el.html(`
        <table id="schedules" lay-filter="schedules"></table>
            <script type="text/html" id="barDemo">
                <a class="layui-btn layui-btn-xs" lay-event="updata">更新</a>
                <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="delete">删除</a>
                <a class="layui-btn layui-btn-xs" lay-event="selectSeats">选座</a>
            </script>
        `);
        this.reRender();
    }
    reRender() {
        layui.table.render({
            elem: '#schedules'
            , method: "get"
            , url: '/api/schedules' //数据接口
            , headers: { Authorization: `Bearer ${adminsApi.getToken()}` }
            , page: true //开启分页
            , limits: [5, 10, 15, 20]
            , cols: [[ //表头
                { field: '_id', title: 'ID', sort: true, fixed: 'left' }
                , { field: 'movieId', title: '电影', templet: '<div>{{d.movieId.cname}}</div>' }
                , { field: 'cinemasId', title: '影院', sort: true, templet: '<div>{{d.cinemasId.name}}</div>' }
                , { field: 'theaterId', title: '放映厅', sort: true, templet: '<div>{{d.theaterId.name}}</div>' }
                , { field: 'showTime', title: '放映时间', sort: true, }
                , { field: 'price', title: '价格', sort: true, }
                , { fixed: 'right', align: 'center', toolbar: '#barDemo' }
            ]],
        });
    }
}